<template>
    <div class="enterprise-comprehensive-details-modal">
        <!-- <a-modal
            class="enterprise-comprehensive-details-modal"
            v-model:visible="enterpriseComprehensiveDetailsvisible"
            title="企业综合详情"
            width="90%"
            @cancel="handleCancel"
            @ok="handleOk"
            cancelText="关闭"
        > -->
            <div style="height: calc(100% - 53px);">
                <div style="display: flex;justify-content: space-around;flex-wrap: wrap;">
                    <div class="enter-info-text enterprise-comprehensive-top">
                        <div class="enter-text">企业名称：{{ frominfo.fqymc }}</div>
                        <div class="enter-text">社会信用代码：{{ frominfo.ftyshxydm }}</div>
                        <div class="enter-text">地址：{{ frominfo.fqyzszcdz }}</div>
                        <div class="enter-text"><a-button class="blue-btn" type="primary" style="margin-left: 48px;" @click="enterpriseDetailsClick(frominfo)">企业详情</a-button></div>
                        
                    </div>
                    <div class="other-info-text enterprise-comprehensive-top">
                        <div class="other-info-btn">
                            <a-button style="margin: 10px;" class="blue-btn" @click="otherInforClick('证照信息')" type="primary">证照信息</a-button>
                            <a-button style="margin: 10px;" class="blue-btn" @click="otherInforClick('质量体系','queryWjljByType')" type="primary">质量体系</a-button>
                        </div>
                        <div class="other-info-btn">
                            <a-button style="margin: 10px;" class="blue-btn" @click="otherInforClick('关键人员','spcyQyInfoQqueryQygjryxxPageList')" type="primary">关键人员</a-button>
                            <a-button style="margin: 10px;" class="blue-btn" @click="otherInforClick('历次审评','spcyQyInfoQueryQyJcxxPageList')" type="primary">历次审评</a-button>
                        </div>
                        <div class="other-info-btn">
                            <a-button style="margin: 10px;" class="blue-btn" @click="otherInforClick('设备设施','spcyQyInfoQuerySbqrxxPageList')" type="primary">设备设施</a-button>
                            <a-button style="margin: 10px;" class="blue-btn" @click="otherInforClick('变更项记录','queryBgkzPageList')" type="primary">变更项记录</a-button>
                        </div>
                    </div>
                    <div class="risk-info-text enterprise-comprehensive-top">
                        <div>
                            <a-button style="margin: 10px;" class="blue-btn" @click="earlyWarningClick('证件预警')" type="primary">证件预警</a-button>
                            <a-button style="margin: 10px;" class="blue-btn" @click="earlyWarningClick('关键指标预警')" type="primary">关键指标预警</a-button>
                        </div>
                        <div>
                            <a-button style="margin: 10px;" class="blue-btn" @click="earlyWarningClick('物料预警')" type="primary">物料预警</a-button>
                            <a-button style="margin: 10px;" class="blue-btn" @click="earlyWarningClick('生产环境预警')" type="primary">生产环境预警</a-button>
                        </div>
                        <!-- <h3 style="width: 100%;text-align: center;font-weight: 600;">风险预警信息</h3>
                        <div class="triangle-v"></div>
                        <div class="risk-box-v">
                            <span>设备未清洁认证20230001批次生产记录缺检验报告</span>
                        </div> -->
                    </div>
                </div>
                <div>
                    <!-- :adaptiveHeight="true" -->
                    <commpVxeTable
                    :key="dataTableKey"
                    :config="dataTableConfig" 
                    :columns="columnsVxe" 
                    :formItem="[]"
                    ref="acceptanceRegistrationRef"
                    :adaptiveHeight="true"
                    >
                        <template v-slot:operation_btn="{row}" data-desc="自定操作栏">
                            <a-form layout="inline" class="search-form" >
                                <a-form-item >
                                    <!-- <a-button class="blue-btn" type="primary" @click="detailSituationClick(row)">查看生产情况</a-button> -->
                                    <a-button class="blue-btn" type="primary" @click="productionBatchClick(row)">生产批次</a-button>
                                </a-form-item>
                                <a-form-item >
                                    <a-button class="blue-btn" type="primary" @click="technologicalProcessClick(row)">工艺流程</a-button>
                                </a-form-item>
                            </a-form>
                        </template>
                    </commpVxeTable>
                </div>
            </div>
            <template slot="footer">
                <div>
                    <a-button @click="handleCancel" style="margin-right: 10px;">关闭</a-button>
                    <a-button v-if="false" @click="handleOk" type='primary'>确定</a-button>
                </div>
            </template>
        <!-- </a-modal> -->
        <increase ref="refModel" :addEditParameter="addEditParameter" @handleOk="increaseHandleOk" :isDisabled="true"/>
        <otherInfor ref="otherInforRef" />
        <breedInfor ref="breedInforRef" />
        <earlyWarning ref="earlyWarningRef" />
        <batchDetails ref="batchDetailsRef" />
        <productionRecords ref="productionRecordsRef" />
    </div>
</template>
<script>
import productionRecords from '../enterprise/information/productionRecords/productionRecords.vue'
import batchDetails from './batchDetails.vue'
import assessCheckApi from './service/api'
import increase from '../assessCheck/enterpriseInformation/increase.vue'
import { queryQyxxById, } from './service/index'
import commpVxeTable from '@/components/commp-vxe-table/commp-vxe-table.vue'
import otherInfor from './otherInfor.vue'
import breedInfor from './breedInfor.vue'
import earlyWarning from './earlyWarning.vue'
export default {
    components:{
        commpVxeTable,
        otherInfor,
        breedInfor,
        increase,
        earlyWarning,
        batchDetails,
        productionRecords,
    },
    props:{

    },
    data(){
        return{
            frominfo:{},
            formState:{},
            enterpriseComprehensiveDetailsvisible:false,
            tableData:[{
                varietyName:'葡萄糖注射液',
                dosageForm:'注射剂',
                specifications:'20ml：10g',
                category:'化学药',
                approvalNumber:'国药准字H45020239',
                id:'breed1',
            }],
            dataTableKey:null,
            dataTableConfig:{
                api: assessCheckApi.queryPzjbxxPageList,
                rowId: 'id',
                height:400,
                autoHidden:true,
                pageSize:10000,
                paramet:{
                }
            },
            columnsVxe:[
            // { 
            //     type: 'checkbox', 
            //     width: 60 ,
            //     fixed: 'left'
            // },
            {
                title: '品种名称', 
                field: 'ftymc',
            },{
                title: '剂型',
                field: 'fjx',
            },{
                title: '规格',
                field: 'fgg',
            },{
                title: '类别',
                field: 'fcplb',
            },{
                title: '批准文号',
                field: 'fpzwh',
            },{
                title: '操作',
                field: 'id',
                slots: {
                // 使用插槽模板渲染
                default: 'operation_btn',
                }
            }],
            addEditParameter:{}
        }
    },
    watch:{

    },
    mounted(){
        //console.log('监听路由',this.$route)
        this.getData(this.$route.query)
    },
    methods:{
        getData(val){
            this.formState = val
            this.dataTableConfig.paramet = {fqyid:val.id}
            this.dataTableKey = Date.now()
            queryQyxxById({id:val.id}).then(res=>{
                if(res.code == 200){
                    this.frominfo = res.result
                }
            })
        },
        increaseHandleOk(){},
        enterpriseDetailsClick(val){
            this.$refs.refModel.visibleShow = true
            this.addEditParameter = {...val,isEnterpriseInformationIndex:true}
        },
        detailSituationClick(row){
            this.$refs.breedInforRef.breedInforVisible = true
            this.$refs.breedInforRef.getData({...row,modalTitle:'查看生产情况--'+row.ftymc})
        },
        otherInforClick(name,val){
            // if(name == '证照信息'){

            // }else{
                this.$refs.otherInforRef.otherInforVisible = true
                this.$refs.otherInforRef.getData({...this.frominfo,modalTitle:name,interfaceType:val})
            // }
            
        },
        productionBatchClick(row){
            this.$refs.productionRecordsRef.getData({fqyid:this.formState.id,...row,view:true,isDisabled:true})
            this.$refs.productionRecordsRef.visible = true
        },
        technologicalProcessClick(row){
            this.$refs.batchDetailsRef.getData({...row,modalTitle:row.ftymc})
            this.$refs.batchDetailsRef.batchDetailsVisible = true
        },
        earlyWarningClick(val){
            this.$refs.earlyWarningRef.getData({title:val,fqyid:this.formState.id})
            this.$refs.earlyWarningRef.visible = true
        },
        handleCancel(){
            this.enterpriseComprehensiveDetailsvisible = false
        },
        handleOk(){
            this.enterpriseComprehensiveDetailsvisible = false
        },
    }
}
</script>
<style lang="less">
.enterprise-comprehensive-details-modal{
    background: #fff;
    .enterprise-comprehensive-top{
        flex: 1;
        min-width: 365px;
        padding: 10px;
    }
    .enter-info-text{
        font-size: 16px;
        font-weight: 600;
        color: #000;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        .enter-text{
            width: 345px;
            overflow: hidden;
            margin-bottom: 8px;
        }
    }
    .other-info-text{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        .other-info-btn{
            display: flex;
            justify-content: space-evenly;
            // margin: 8px 3px;
            .ant-btn{
                width: 103px;
            }
        }

    }
    .risk-info-text{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        // .triangle-v {
        //     width: 0; 
        //     height: 0; 
        //     border-top: 50px solid #f00; 
        //     border-left: 50px solid transparent; 
        //     border-right: 50px solid transparent; 
        //     border-bottom: 50px solid transparent;
        //     border: 1px solid #000;
        //     position: relative;
        // }

        // .triangle-v::before {

        // }
        .risk-box-v{
            border: 2px solid #8A8A8A;
            border-radius: 10px;
            height: 109px;
            padding: 10px;
            overflow-y: auto;
        }
    }
}
// .enterprise-comprehensive-details-modal {
//   .ant-modal {
//     max-width: 80%;
//     top: 100px;
//     left: 10%;
//     padding-bottom: 0;
//     margin: 0;
//   }
//   .ant-modal-content {
//     display: flex;
//     flex-direction: column;
//     height: calc(100vh - 200px);
//     overflow: auto;
//     background-color: #fff;
//   }
//   .ant-modal-body {
//     flex: 1;
//     height: 100%;
//     background-color: #fff;
//   }
// }
</style>